const { merge } = require("webpack-merge");
const path = require("path");
const baseConfig = require("./webpack.config");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const { CleanWebpackPlugin } = require("clean-webpack-plugin");
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
const TerserPlugin = require("terser-webpack-plugin");
const CopyWebpackPlugin = require("copy-webpack-plugin");

console.log(CssMinimizerPlugin, TerserPlugin);

process.env.NODE_ENV = "production";

module.exports = merge(baseConfig, {
  mode: "production",
  externals: {
    react: "React",
    "react-dom": "ReactDOM",
    moment: "moment",
    antd: "antd",
  },
  plugins: [
    new MiniCssExtractPlugin({
      filename: "/css/[name].[contenthash:8].css",
      chunkFilename: "/css/[name].[contenthash:8].chunk.css",
    }),
    new CleanWebpackPlugin(),
    new CopyWebpackPlugin({
      patterns: [
        {
          from: "public/",
          filter: (p) => {
            return !/html$/.test(p);
          },
        },
      ],
    }),
  ],
  optimization: {
    minimizer: [
      new TerserPlugin({
        terserOptions: {
          parse: {
            ecma: 8,
          },
          compress: {
            ecma: 5,
            warnings: false,
            comparisons: false,
          },
          mangle: {
            safari10: true,
          },
          output: {
            ecma: 5,
            comments: false,
            ascii_only: true,
          },
        },
        parallel: true,
        cache: true,
        sourceMap: false,
      }),
      new CssMinimizerPlugin(),
    ],
    splitChunks: {
      chunks: "all",
      name: true,
      maxInitialRequests: 6,
    },
    runtimeChunk: true,
  },
});
